<template>
  <!-- 车品主页 -->
	<view class="car-goods-container">
		<view class="search-bar">
			<u-search :show-action="false" placeholder="搜索品牌/品类/名称等" bg-color="#fff" v-model="listParams.keyword" :height="66" @search="search"></u-search>
		</view>
		<view class="header">
			<view class="top-bar flex flex-jc-sb flex-ai-c">
				<view class="li" @click="fabuxcclick(0)">
					<view class="icon">
						<i-icon icon="iconfabunew" type="multiple" size="79rpx"></i-icon>
					</view>
					<view class="name">发布车品货源</view>
				</view>
				<view class="li" @click="fabuxcclick(1)">
					<view class="icon">
						<i-icon icon="iconguanli1" type="multiple" size="79rpx"></i-icon>
					</view>
					<view class="name">车品管理</view>
				</view>
				<view class="li" @click="fabuxcclick(2)">
					<view class="icon">
						<i-icon icon="iconwodedingdan" type="multiple" size="79rpx"></i-icon>
					</view>
					<view class="name">我的订单</view>
				</view>
			</view>
		</view>
    
    <!-- 筛选下拉菜单 -->
    <u-sticky offset-top="90" bg-color="none" @fixed="fixedFlag = true" @unfixed="fixedFlag = false">
      <view class="filter-box" :class="fixedFlag ? 'm-lr-0':'m-lr-12'">
        <car-goods-filter :category-list="categoryList" @change="filterChange" @open="filterOpen"></car-goods-filter>
      </view>
    </u-sticky>
    
    <!-- 车品列表 -->
    <view class="goods-list">
      <!-- 数据为空时的默认图 -->
      <default-img :show="goodsList.length === 0" msg="暂无相关车品"></default-img>
      
      <car-beauty :carList="goodsList"></car-beauty>
      <u-loadmore v-show="goodsList.length !== 0" :status="loadingStatus[loadingStatusIndex]" @loadmore="loadmoreClick"></u-loadmore>
    </view>
	</view>
</template>

<script src="./carGoods.js"></script>

<style lang="scss" scoped>
	@import './carGoods.scss';
</style>
